<html>
<head>

    <link type="text/css" href="includes/jquery/css/ui-lightness/jquery-ui-1.8.16.custom.css" rel="stylesheet" />
    <link type="text/css" href="includes/jquery/css/app-portfolio.css" rel="stylesheet"/>
   <style>
        body { font-size: 62.5%; }
		label, input { display:block; }
		input.text { margin-bottom:12px; width:95%; padding: .4em; }
		fieldset { padding:0; border:0; margin-top:25px; }
		h1 { font-size: 1.2em; margin: .6em 0; }
		div#users-contain { width: 350px; margin: 20px 0; }
		div#users-contain table { margin: 1em 0; border-collapse: collapse; width: 100%; }
		div#users-contain table td, div#users-contain table th { border: 1px solid #eee; padding: .6em 10px; text-align: left; }
		.ui-dialog .ui-state-error { padding: .3em; }
		.validateTips { border: 1px solid transparent; padding: 0.3em; }
   </style>
    <!-- USer Manager Service -->
    <script type='text/javascript' src='/app-portfolio/dwr/interface/UserManager.js'></script>
    <script type='text/javascript' src='/app-portfolio/dwr/engine.js'></script>

    <script type="text/javascript" src="includes/jquery/js/jquery.js"></script>
    <script type="text/javascript" src="includes/jquery/js/jquery-ui-1.8.16.custom.min.js"></script>
    <script type="text/javascript" src="includes/javascript/tabs.js"></script>

    <script type="text/javascript">
        getIntialPage();
    </script>

    <title>Portfolio Projects</title>
</head>
<body>
<div id="header">
</div>
<div id="tabs">
    <ul>
        <li><a href="#contact-tab">Contatos</a></li>
        <!--<li><a href="#tabs-2">Projects</a></li>-->
        <li>
            <a href="#admin-tab">Admin</a>
        </li>
    </ul>
    <div id="contact-tab"></div>
    <!--<div id="tabs-2"></div>-->
    <div id="admin-tab">
        <!-- buttons admin tab -->
        <div class="admin-btn">
            <button id="create-user-btn">Create a new User</button>
            <button id="update-user-btn">Update a user</button>
            <button id="delete-user-btn">Delete a user</button>
        </div>
    </div>
</div>

<!-- dialog create user -->
<div id="dialog-create-user" title="Create new user">
    <div id="create-new-user-form" title="Create new user" hidden=true>
        <p class="validateTips">All form fields are required.</p>
        <form>
            <fieldset>
                <label for="user-name">Name</label>
                <input type="text" name="name" id="user-name" class="text ui-widget-content ui-corner-all" />
                <label for="user-email">Email</label>
                <input type="text" name="email" id="user-email" value="" class="text ui-widget-content ui-corner-all" />
                <label for="user-password">Password</label>
                <input type="password" name="password" id="user-password" value="" class="text ui-widget-content ui-corner-all" />
                <label for="role-options">User role</label>
                <select id="role-options" >
                    <option value="0">User</option>
                    <option value="1">Admin</option>
                </select>
            </fieldset>
        </form>
    </div>
</div>
</body>
</html>